<div>
    <#include "/header.html">
    <div id="zyApp" v-cloak>
        <!--菜单展示-->
        <el-menu class="el-menu-demo" mode="horizontal"
                 size="mini"
                 menu-trigger="click"
                 active-text-color="#66b1ff"
                 ref="categoryMenu"
                 @select="handleSelect">
            <el-submenu index="1">
                <template slot="title">快印商品</template>
                <el-menu-item :index="category.ziyunCategoryId" type="fast" v-for="(category, index) in fast.categoryData">
                    {{category.categoryName}}
                </el-menu-item>
            </el-submenu>
            <el-submenu index="2">
                <template slot="title">商务印刷</template>
                <el-menu-item :index="category.ziyunCategoryId" type="print" v-for="(category, index) in print.categoryData">
                    {{category.categoryName}}
                </el-menu-item>
            </el-submenu>
            <el-menu-item index="3">标品</el-menu-item>
        </el-menu>
        <!--产品信息展示-->
        <!--1. 循环部件-->
        <el-collapse v-model="mustChoiceParts">
            <el-form :inline="true" :model="calculateData" :rules="calculateFormRules"  ref="calculateForm"
                     label-width="100px" class="demo-form-inline" size="mini">
                <el-collapse-item
                        v-for="quoteParts in quoteProductInfo.quotePartsList"
                        :title="quoteParts.name"
                        :name="quoteParts.constructId"
                >
                    <!--展示每个部件quoteAttributeList-->
                    <!--普通属性-->
                    <el-form-item
                            style="margin-bottom: 0px"
                            v-for="quoteAttribute in quoteParts.quoteAttributeList"
                            v-if="quoteAttribute.attributeType == 'normal' "
                            >
                        <el-form-item
                                style="margin-bottom: 0px"
                                :label="quoteAttribute.name"
                                :prop="'attributesMap.'+quoteParts.constructId+'.'+quoteAttribute.attributeTypeValue"
                        >
                            <!--展示属性选项-->
                            <el-select
                                    style="width: 130px"
                                    v-model="calculateData.attributesMap[quoteParts.constructId][quoteAttribute.attributeTypeValue]"
                                    clearable placeholder="请选择" >
                                <el-option
                                        v-for="quoteOption in quoteAttribute.quoteAttributeOptionList"
                                        :key="quoteOption.id"
                                        :label="quoteOption.name"
                                        :value="quoteOption.id">
                                </el-option>
                            </el-select>
                        </el-form-item>

                        <!--展示自定义-->
                        <el-checkbox v-model="isShowDefined[quoteParts.constructId][quoteAttribute.attributeTypeValue]"
                                     v-if="quoteAttribute.canDefinition"
                                     @change="defineChange(quoteParts.constructId,quoteAttribute,$event)">
                            自定义
                        </el-checkbox>
                        <el-form-item
                                v-if="isShowDefined[quoteParts.constructId][quoteAttribute.attributeTypeValue]"
                                v-for="(define,index) in definedArr[quoteParts.constructId][quoteAttribute.attributeTypeValue]"
                                :prop="'definitionValueMap.'+quoteParts.constructId+'.'+quoteAttribute.attributeTypeValue+'.'+index">
                            <el-input v-model.number="calculateData.definitionValueMap[quoteParts.constructId][quoteAttribute.attributeTypeValue][index]"
                                      style="width: 70px"
                                      :placeholder="define">
                            </el-input>
                        </el-form-item>


                    </el-form-item>
                    <!--必选显示工艺-->
                    <el-form-item
                            style="margin-bottom: 0px"
                            v-for="quoteAttribute in quoteParts.quoteAttributeList"
                            v-if="quoteAttribute.attributeType == 'craft' && quoteAttribute.mustChioce == true &&
                            quoteAttribute.attributeDisplay == true "
                            :label="quoteAttribute.name"
                            :prop="'attributesMap.'+quoteParts.constructId+'.'+quoteAttribute.attributeTypeValue">
                        <!--展示属性选项-->
                        <el-select
                                style="width: 130px"
                                v-model="calculateData.attributesMap[quoteParts.constructId][quoteAttribute.attributeTypeValue]"
                                clearable placeholder="请选择">
                            <el-option
                                    v-for="quoteOption in quoteAttribute.quoteAttributeOptionList"
                                    :key="quoteOption.id"
                                    :label="quoteOption.name"
                                    :value="quoteOption.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <!--材料-->
                    <el-form-item
                            style="margin-bottom: 0px"
                            v-for="quoteAttribute in quoteParts.quoteAttributeList"
                            v-if="quoteAttribute.attributeType == 'material' "
                            :label="quoteAttribute.name"
                            :prop="quoteParts.constructId+quoteAttribute.attributeTypeValue">
                        <!--展示材料属性选项-->
                        <el-select style="width: 130px"
                                   v-model="material[quoteParts.constructId].defaultOption"
                                   @change="materialChange($event,quoteParts.constructId,quoteAttribute.quoteAttributeOptionList)"
                                   clearable placeholder="材料">
                            <el-option
                                    v-for="quoteOption in quoteAttribute.quoteAttributeOptionList"
                                    :key="quoteOption.optionKey"
                                    :label="quoteOption.name"
                                    :value="quoteOption.optionKey">
                            </el-option>
                        </el-select>
                        <el-select
                                style="width: 100px"
                                v-model="calculateData.attributesMap[quoteParts.constructId][quoteAttribute.attributeTypeValue]"
                                clearable placeholder="克重">
                            <el-option
                                    v-for="materialOption in material[quoteParts.constructId].sonOptionList"
                                    :key="materialOption.id"
                                    :label="materialOption.name"
                                    :value="materialOption.id">
                            </el-option>

                        </el-select>
                        <el-checkbox
                                v-if="quoteParts.selfPaper === true"
                                v-model="calculateData.selfPaperParts[quoteParts.constructId]" style="font-size: 12px">
                            <span style="font-size: 10px">自来纸</span>
                        </el-checkbox>
                    </el-form-item>
                    <!--非必选显示工艺-->
                    <p v-show="isShowCraft[quoteParts.constructId]">
                        <el-checkbox v-model="addShowCraft[quoteParts.constructId]">添加工艺</el-checkbox>
                    </p>
                    <el-form-item
                            style="margin-bottom: 0px"
                            v-for="quoteAttribute in quoteParts.quoteAttributeList"
                            v-if="quoteAttribute.attributeType == 'craft' && quoteAttribute.mustChioce != true &&
                            quoteAttribute.attributeDisplay == true && addShowCraft[quoteParts.constructId] == true "
                            :label="quoteAttribute.name"
                            :prop="quoteAttribute.attributeTypeValue">
                        <!--展示属性选项-->
                        <el-select
                                style="width: 130px"
                                v-model="calculateData.attributesMap[quoteParts.constructId][quoteAttribute.attributeTypeValue]"
                                clearable placeholder="请选择">
                            <el-option
                                    v-for="quoteOption in quoteAttribute.quoteAttributeOptionList"
                                    :key="quoteOption.id"
                                    :label="quoteOption.name"
                                    :value="quoteOption.id">
                            </el-option>
                        </el-select>
                    </el-form-item>

                </el-collapse-item>
                   <el-button
                           style="margin: 5px;margin-left: 40%;"
                           size="mini"
                           v-if="mustChoiceParts.length >0"
                           type="primary"
                           @click="submitForm('calculateForm')">算价
                   </el-button>
            </el-form>
        </el-collapse>
        <script src="${request.contextPath}/statics/js/modules/order/calculatePrice.js?_${.now?long}"></script>
    </div>
</div>